<script setup lang="ts">
import {ref,provide} from 'vue'
import Test from './test.vue';
import { THEMEKEY } from './symbolkey'
import type { themeType } from './symbolkey'

// 响应式主题数据
const themeState = ref<themeType>('light')

//切换主题
const toggleTheme = ()=>{
  themeState.value = themeState.value === 'dark'?'light':'dark'
}

//提供响应式数据
provide(THEMEKEY,themeState)
</script>

<template>
<div>this is div {{ themeState }} </div>
<button @click="toggleTheme">切换主题</button>
<Test/>
</template>

